<template>
<ul class="shops">
  <li>
    <div  class="flex" >
      <img :src="shop.imgUrl" alt="" class="shopimg" />
      <div>
        <p class="title">{{ shop.title }}</p>
        <p class="count">
          <span>月售：{{ shop.sales }}</span> &nbsp;&nbsp;<span>起送：{{
            shop.expressLimit}}</span>
          &nbsp;&nbsp;<span>基础运费:{{ shop.expressPrice }}</span>
        </p>
        <p class="redcontent">{{ shop.desc }}</p>
      </div>
    </div>
  </li>
</ul>
</template>

<script setup>
const data = defineProps(["shop"]);
</script>

<style lang="scss" scoped>
 .shops {
   > li {
     height: 100px;
     .flex {
          display: flex;
          justify-content: space-around;
          margin-top: 10px;
          .shopimg {
            width: 55px;
            height: 55px;
          }
          > div {
            border-bottom: 1px solid #f8f8f8;
            .title {
              font-size: 16px;
              color: #333333;
            }
            .count {
              font-size: 13px;
              margin-top: 5px;
              color: #333333;
            }
            .redcontent {
              font-size: 13px;
              margin-top: 5px;
              color: red;
            }
          }
        }
      }
    }
</style>
